extends ../layout

block content
    article.ss-full-width
        #content_box
            #content.hfeed
                #post-200.post-200.page.type-page.status-publish.hentry.g.post.has_thumb
                    header
                        h1.title iTunes App排行榜
                        
                    .post-content.box.mark-links
                        table
                            thead
                                tr
                                    th(width="15%")
                                        select.state
                                            option(value="cn", selected) 中国
                                            option(value="us") 美国
                                            option(value="hk") 香港
                                            option(value="tw") 台湾
                                            option(value="jp") 日本
                                    th(width="20%")        
                                        select.count
                                            option(value="10", selected) 10
                                            option(value="25") 25
                                            option(value="50") 50
                                            option(value="100") 100
                                            option(value="300") 300
                                    th(width="55%")
                                        select.type
                                            option(value="topfreeapplications", selected)免费App排名
                                            option(value="toppaidapplications")收费 App排名
                                            option(value="topgrossingapplications")畅销 App排名
                                            option(value="topfreeipadapplications")免费 iPad App排名
                                            option(value="toppaidipadapplications")付费 iPad App排名
                                            option(value="topgrossingipadapplications")畅销 iPad App排名
                                            option(value="newapplications")新 App
                                            option(value="newfreeapplications")新的免费应用程序
                                            option(value="newpaidapplications")新的付费应用程序
                                    th(width="10%")
                                        select.genre
                                            option(value="", selected) 所有类型
                                            option(value="6014") 游戏
                                            option(value="6011") 音乐
                                            option(value="6018") 图书
                                            option(value="6016") 娱乐
                                tr
                                    th 序号
                                    th 图标
                                    th 名称
                                    th 价格
                            tbody
                            tfoot
                                tr
                                    th 更新时间：
                                    th(colspan="2") 
                                        span.time
                                    th &nbsp;

block script
    script(src="#{options.cdn_path}/combo?/lib/artTemplate/js/template.min.js,/lib/moment/moment.min.js,/lib/moment/lang/zh-cn.js&v=#{options.site_version}")
    script#tableTemp(type="text/html")
        |<tr>
        |<th><%=id%></th>
        |<th><img class="lazy" src="<%=image%>" width="53" heigh="53" title="<%=name%>"></th>
        |<th><a target="_blank" href="<%=link%>" title="<%=name%>"><%=name%></a></th>
        |<th><%=price%></th>
        |</tr>
    script
        $(function(){
            var count, getCharts, state, type, url, genre;
            state = "cn";
            type = "topfreeapplications";
            count = 10;
            genre = "";
            getCharts = function(url, callback) {
                return $.getJSON(url, function(data) {
                    var bean, json, temp, _i, _len, _ref;
                    moment.lang('zh-cn');
                    json = {
                        updated: moment.utc(data.feed.updated.label).fromNow(),
                        entry: []
                    };
                    _ref = data.feed.entry;
                    for (_i = 0, _len = _ref.length; _i < _len; _i++) {
                        bean = _ref[_i];
                        temp = {};
                        temp.name = bean['im:name'].label;
                        temp.image = bean['im:image'][0].label;
                        temp.price = bean['im:price'].label;
                        temp.title = bean['title'].label;
                        temp.link = bean['id'].label;
                        json.entry.push(temp);
                    }
                    return callback(json);
                });
            };
            
            var isIe = $.browser.msie ? "?callback=?" : "";
            url = "https://itunes.apple.com/" + state + "/rss/" + type + "/limit=" + count + "/genre=" + genre + "/json" + isIe;
            
            getCharts(url, function(data) {
                $('tfoot .time').text(data.updated);
                var beans = data.entry;
                var bean, _i, _len;
                for (_i = 0, _len = beans.length; _i < _len; _i++) {
                    bean = beans[_i];
                    bean.id = _i + 1;
                    var html = template.render('tableTemp', bean);
                    $('table tbody').append(html).hide().show("slow");
                }
            });
    
            $('select').change(function(){
                if($(this).hasClass('state')) {
                    state = $(this).val();
                } else if ($(this).hasClass('type')) {
                    type = $(this).val();
                } else if ($(this).hasClass('count')) {
                    count = $(this).val();
                } else if ($(this).hasClass('genre')) {
                    genre = $(this).val();
                }
                url = "https://itunes.apple.com/" + state + "/rss/" + type + "/limit=" + count + "/genre=" + genre + "/json" + isIe;
                getCharts(url, function(data) {
                    $('tfoot .time').text(data.updated);
                    var beans = data.entry;
                    var bean, _i, _len;
                    $('table tbody').html('');
                    for (_i = 0, _len = beans.length; _i < _len; _i++) {
                        bean = beans[_i];
                        bean.id = _i + 1;
                        var html = template.render('tableTemp', bean);
                        $('table tbody').append(html).hide().show("slow");
                    }
                });
            });
        })